import { Component, OnInit } from '@angular/core';
import { Router, Event, NavigationEnd } from '@angular/router';
import { filter } from 'rxjs/operators';

@Component({
  selector: 'app-index',
  templateUrl: './index.component.html',
  styleUrls: ['./index.component.css']
})
export class IndexComponent implements OnInit {

  // 当前url
  currentUrl: string;
  // 面包导航列表
  breadcrumbList: string[];

  constructor(
    private router: Router,
  ) { 
    // 监听路由事件，获取url
    this.router.events
      .pipe(
        filter((event: Event) => event instanceof NavigationEnd)
      )
      .subscribe((value: NavigationEnd) => {
        console.log(value.urlAfterRedirects)
        this.currentUrl = value.urlAfterRedirects;
        this.setBreadcrumb(value.urlAfterRedirects);
      });
      
  }

  setBreadcrumb(url: string) {
    // 在根目录下
    if (url === '/') {
      this.breadcrumbList = ['Welcome'];
    }
    let urlList: string[] = url.substr(1).split('/');
    // 首字母大写
    this.breadcrumbList = urlList.map(url => url.substring(0, 1).toUpperCase() + url.substring(1));
  }


  ngOnInit() {
  }

  

}
